<template>
	<view>
		<view class="con">
			<!-- <view class="posifi flex-a-i top0" :style="{paddingTop:shh+'px'}">
				<view class="flex-ju-b wf  posire pt30">
					<view class="flex-a-i color666 size28">
						<uni-icons @click="back" type="left" size="22" color="#000"></uni-icons>
						需拼写{{info.currentNumber}}/{{info.totalNumber}}
					</view>
				</view>
			</view> -->
			
			<view class="flex-ju-c pt160">
				<image :src="info.image" class="wh360-480 ra20"></image>
			</view>
			
			<input  class="flex1 center bold size60 mt30  height80" placeholder="点击输入单词" v-model="val"/>
			<view class="flex-ju-c mt20">{{info.definition}}</view>
			<view class="flex-ju-c mt20">{{info.ukPhonetics}}</view>
			<view :style="{paddingBottom:bhh+'px'}" class="posifi bottom0 width92vw">
				<view @click="tapsubmit"  class="bgFE3C60 size32 flex-ju-c colorfff ra20 height100   ">
					确定
				</view>
			</view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				val:"",
				info:{}
			}
		},
		onLoad() {
			this.http('/api/spelling',{
			},'post').then(res=>{
				this.info = res.data
			})
		},
		methods: {
			tapsubmit(){
				
				
				
				if(this.val){
					if(this.info.word == this.val){
						this.http('/api/spelling',{
							wordId:this.info.wordId,
							word:this.val
						},'post').then(res=>{
							this.val=''
							this.info = res.data
						})
					}else{
						this.toast('单词错误')
					}
					
				}else{
					this.toast('请输入')
				}
				
			},
		}
	}
</script>

<style>

</style>
